<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/setting.css" />
		<style type="text/css">
			.update {
				margin-right: 20px;
			}
			
			.icno_img {
				width: 20px;
				height: 20px;
				margin-right: 10px;
				margin-bottom: -3px;
			}
			.mui-bar-nav{
				border: none;
				outline: none;
				-webkit-box-shadow:none;
				box-shadow:none;
				border-bottom: 1px solid rgba(0, 0, 0, .1);
			}
			#o:after{
				display: none;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav header" style="background-color: white;box-shadow：none">
			<a id="close" class="mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">我</h1>
			<a class="mui-icon mui-icon-gear mui-pull-right" id="setting"></a>
		</header>

		<div class="mui-content">
			<div id="me">
				<ul class="mui-table-view mui-table-view-chevron">
					<li class="mui-table-view-cell mui-media">
						<a class="mui-navigate-right" href="javascript:void(0);" id="o">
							<img class="mui-media-object mui-pull-left head-img" id="head-img" :src="add.avatar">
							<div class="mui-media-body" style="position: relative;" >
								<span v-text="add.username"></span>
								<span class="mui-badge mui-badge-danger" style="margin-left:3px;font-size: 10px;padding: 2px 4px;position: absolute;" v-text="add.reputation"></span>
								<p class='mui-ellipsis'><span style="color: #EB7A77;" >&nbsp;<span v-text="num"></span>&nbsp;</span>粉丝</p>
							</div>
						</a>
					</li>
				</ul>
				<ul class="mui-table-view mui-table-view-chevron">
					<li class="mui-table-view-cell">

						<a href="javascript:activityoverview();" class="mui-navigate-right activit" >
							<img src="../img/huodong.png" class="icno_img" /> 活动总览
						</a>
					</li>
					<li class="mui-table-view-cell">

						<a href="javascript:follow();" class="mui-navigate-right" id="follow">
							<img src="../img/guanzhu.png" class="icno_img" /> 我的关注
						</a>
					</li>
				</ul>
				<ul class="mui-table-view mui-table-view-chevron">
					<li class="mui-table-view-cell">

						<a href="javascript:tips();" class="mui-navigate-right">
							<img src="../img/liaotian.png" class="icno_img" /> 聊天
						</a>
					</li>
					<li class="mui-table-view-cell">

						<a href="javascript:tips();" class="mui-navigate-right">
							<img src="../img/pingjia.png" class="icno_img" /> 评价
						</a>
					</li>

				</ul>
				<ul class="mui-table-view ables">
					<li class="mui-table-view-cell disable_a">

						<a href="javascript:tips();" class="mui-navigate-right">
							<img src="../img/id.png" class="icno_img" /> 身份证绑定
							<i class="mui-pull-right update">已绑定</i></a>
					</li>
					<li class="mui-table-view-cell ">

						<a href="javascript:tips();" class="mui-navigate-right disable_a">
							<img src="../img/xuehao.png" class="icno_img" /> 学号绑定
							<i class="mui-pull-right update" style="color: #D69891;">未绑定</i></a>
					</li>

				</ul>
				<ul class="mui-table-view mui-table-view-chevron">
					<li class="mui-table-view-cell">

						<a href="javascript:tips();" class="mui-navigate-right">
							<img src="../img/mima.png" class="icno_img" /> 重置密码
						</a>
					</li>
				</ul>
			</div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../vue/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/ip.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();

			var one = new Vue({
							el: '#me',
							data: {
								add: '',
								num: ''
							}
						});
			function ajax(){
				mui.ajax('http://' + ip + '/xiaojv/Api/index.php?p=front&m=me&a=me', {
					data: {},
					dataType: 'json', //服务器返回json格式数据
					type: 'post', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；           
					success: function(data) {
						one.add = data['data'][0];
						one.num = data['num'];
						
					},
					error: function(xhr, type, errorThrown) {
						//异常处理；
						console.log(type);
					}
				});
			}
			ajax()
			//点击设置
			var setting = document.getElementById("setting");
			setting.addEventListener("tap", function() {

				mui.openWindow({
					url: 'setting.html'
				});
			});

			//活动总览
				function activityoverview(){
					mui.openWindow({
						url: 'activityoverview.html'
					});
				}
			//点击关注
				function follow(){
					mui.openWindow({
					url: 'follow.html'
				});
				}
				
				
			document.querySelector('#close').addEventListener('click',function(){
				var meview = plus.webview.currentWebview();
				meview.close();
			})
			
			
			function tips(){
				mui.toast('敬请期待')
			}
		</script>
	</body>

</html>